<template>
	<view class="setup">
		<ul>
			<li @click='uploadImg'>
				<span>{{ getUserName }}</span>
				<image class='img' :src="getUserImg"></image>
			</li>
			<li @click='getUser'>
				<span>用户信息授权</span>
				<span>></span>
			</li>
			<li @click='getUserAddress'>
				<span>获取微信收货地址</span>
				<span>></span>
			</li>
		</ul>
		<view class='bottom' v-for='(item,index) in userInfo' :key='index'>
			<p>微信收货地址：∨</p>
			<p>姓名：{{ item.name }}</p>
			<p>电话：{{ item.phone }}</p>
			<p>地址：{{ item.address }}</p>
			<p>邮编：{{ item.msg }}</p>
		</view>
		<button class='serviceBtn' @click="goLogin">退出登录</button>
	</view>
</template>

<script>
	export default{
		computed:{
			getUserName(){
				return this.$store.state.a.infoName
			},
			getUserImg(){
				return this.$store.state.a.infoImg
			},
			userInfo(){
				return this.$store.state.a.userInfo
			}
		},
		methods:{
			getUser(){
				uni.openSetting({
				  success() {
				    uni.showToast({
				    	title:'位置授权修改成功'
				    })
				  }
				})
			},
			getUserAddress(){
				let that = this
				uni.chooseAddress({
				  success(res) {
						let obj = {
							name: res.userName,
							phone: res.telNumber,
							address: res.provinceName + res.cityName + res.countyName + res.detailInfo,
							msg: res.postalCode,
						}
						that.$store.state.a.userInfo = []
						that.$store.state.a.userInfo.push(obj);
						uni.showToast({
							title: '收货地址修改成功！',
							icon: 'none'
						})
				  }
				})
			},
			goLogin(){
				uni.reLaunch({
					url:'/pages/login/login'
				})
			},
			uploadImg(){
				let that = this
				uni.chooseImage({
					count: 1,
					success(res){
						that.$store.state.a.infoImg = res.tempFilePaths
					}
				})
			},
		}
	}
</script>

<style lang='scss'>
ul{
	padding: 0;
	width: 95%;
	margin-left: 2.5%;
	li:first-child{
		width: 100%;
		height: 150rpx;
		line-height: 150rpx;
	}
	li{
		width: 100%;
		height: 120rpx;
		line-height: 120rpx;
		border-bottom: 1rpx solid rgba(176,196,222,0.3);
		display: flex;
		align-items: center;
		justify-content: space-between;
		color: #808080;
		.img{
			width: 90rpx;
			height: 90rpx;
			border-radius: 50%;
		}
		span{
			margin-left: 10rpx;
		}
	}
}
.serviceBtn{
	position: fixed;
	bottom: 10%;
	left: 2.5%;
}
.bottom{
	margin: 60rpx 2.5% 0;
	padding: 0;
	width: 95%;
	margin-left: 2.5%;
	p{
		width: 100%;
		height: 100rpx;
		line-height: 100rpx;
		border-bottom: 1rpx solid rgba(176,196,222,0.3);
		display: flex;
		align-items: center;
		color: #808080;
	}
}
.serviceBtn{
	width: 95%;
	height: 90rpx;
	line-height: 90rpx;
	margin-top: 45vh;
	letter-spacing: 5rpx;
	background-image: linear-gradient(to right,#00BFFF,#1E90FF);
	color: white;
}
</style>
